mapping dispatch to props

import { bindActionCreators } from 'redux';
import { addCharacterById } from '../actions';

bindActionCreators
綁定 action

function mapDispatchToProps(dispatch){
  return bindActionCreators({ addCharacterById }, dispatch);
} 

export default connect(mapStateToProps, mapDispatchToProps)(CharacterList);

以上另外一種簡短寫法是：

export default connect(mapStateToProps, {addCharacterById})(CharacterList);

在 export 的地方，直接透過物件，列出我們要綁定的 addCharacterById，如此一來便不需要再多寫一個 mapDispatchToProps helper。

trigger event

加上一個 + 符號，當加號被點擊時，便觸發事件。透過 onClick 去綁定被點擊的物件

<div onClick={() => this.props.addCharacterById(character.id)}>
   +
</div>

現在可以看到 console.log 倒數四行，顯示我剛剛點擊的物件

Styling Application
現階段先來美化一下我的應用程式，寫到這邊腦袋快燒乾了。
先在 public/index.html 套用 bootstrap cdn，並在 src 建立 styles 資料夾。我們可以把所有 css 相關檔案放在這個資料夾中。

在 App.js 裡引入 css

import '../styles/index.css';

並在 <div> 加上 className 便可以透過這個 className 進行樣式設定。

持續更新ing